/**
 * @file _ocean.scss
 * @description 定义海洋主题的 CSS 变量。
 */

/* Ocean Theme - Calm and Soothing */
html.theme-ocean {
  // 基础色彩
  --bg-color: #f0f7f8;
  --bg-color-page: #e6f2f5;
  --bg-color-secondary: #ffffff;
  --bg-color-light: #dcf0f5;
  --bg-color-dark: #b8e2eb;
  --bg-color-disabled: #e6f2f5;
  --text-color: #0b4f6c;
  --text-color-primary: #0b4f6c;
  --text-color-secondary: #1d7293;
  --text-color-placeholder: #6a9baf;
  --text-color-disabled: #a9c5d1;
  --text-color-inverse: #ffffff;
  
  // 边框和分割线
  --border-color: #b8d8e3;
  --border-color-light: #d0e6ed;
  --border-radius-base: 10px;
  
  // 主色调
  --primary-color: #20a4f3;
  --primary-color-rgb: 32, 164, 243;
  --secondary-color: #1dd2af;
  --success-color: #1dd2af;
  --warning-color: #ffc857;
  --danger-color: #f75c6c;
  --error-color: #f75c6c;
  --info-color: #5dadec;
  
  // 组件背景
  --card-bg: var(--bg-color-secondary);
  --card-shadow: 0 4px 12px rgba(29, 114, 147, 0.1);
  --card-border: 1px solid var(--border-color-light);
  
  // 按钮状态
  --button-primary-bg: var(--primary-color);
  --button-primary-text: #ffffff;
  --button-primary-hover-bg: #1a8cd9;
  --button-secondary-bg: var(--bg-color-light);
  --button-secondary-border: var(--border-color);
  
  // 表单元素
  --input-bg: var(--bg-color-secondary);
  --input-border: var(--border-color);
  --input-focus-border: var(--primary-color);
  --input-placeholder: var(--text-color-placeholder);
  
  // 无障碍
  --focus-ring: 0 0 0 2px rgba(32, 164, 243, 0.2);
  --hover-overlay: rgba(32, 164, 243, 0.05);
  --active-overlay: rgba(32, 164, 243, 0.1);
  
  // 玻璃效果
  --backdrop-blur: 12px;
  --glass-bg: rgba(240, 247, 248, 0.8);
  --glass-border: rgba(11, 79, 108, 0.1);
  
  // 禁用状态
  --disabled-bg-color: var(--bg-color-disabled);
  --disabled-border-color: var(--border-color-light);
  --disabled-text-color: var(--text-color-disabled);
  
  // 下拉组件
  --select-bg: var(--bg-color-secondary);
  --select-border-color: var(--border-color);
  --select-option-hover-bg: var(--bg-color-light);
  
  // 时间选择器
  --time-picker-bg: var(--bg-color-secondary);
  --time-picker-border-color: var(--border-color);
  --time-picker-cell-hover: var(--hover-overlay);
  
  // 滚动条
  --scrollbar-track: #e6f2f5;
  --scrollbar-thumb: #b8d8e3;
  --scrollbar-thumb-hover: #9bbcc7;
  
  // 链接
  --link-color: var(--primary-color);
  --link-hover-color: #4da6ff;
  --link-visited-color: #9966cc;
}